<template>
    <!-- 跳转到小程序 -->
    <the-dialog :cfg="cfg" width="36%" :need-footer="false">
        <div class="qr-popup" slot="body">
            <div>{{ tipTxt }}</div>
            <el-image class="qr-img" fit="contain" lazy :src="qrUrl">
                <div slot="error" class="image-slot">
                    <i class="el-icon-picture-outline"></i>
                </div>
            </el-image>
            <div class="c-primary">请使用微信扫描二维码</div>
        </div>
    </the-dialog>
</template>

<script>
    export default {
        data() {
            return {
                cfg: {
                    visible: false,
                    title: '',
                    noHeadImg: true
                },
                tipTxt: '尊敬的用户您好，请先到小程序进行 CA 签署',
                qrUrl: '',
            }
        },
        methods: {
            onOpen({ tips } = {}) {
                this.cfg.visible = true;

                if (tips) this.tipTxt = tips;
                this.getMiniQr()
            },
            getMiniQr() {
                this.$ajax.getMiniLogo().then(res => {
                    this.qrUrl = res.data.miniLogo || ''
                }).catch(err => {
                    this.$util.message(err.msg)
                })
            },
            onClose() {
                this.cfg.visible = false;
            }
        },
        mounted() {

        }
    }
</script>

<style lang="scss">
    .qr-popup {
        text-align: center;

        .qr-img {
            width: 50%;
            max-width: 250px;
            margin: 20px auto;
        }

        .c-primary {
            color: $--type-primary;
        }
    }
</style>